<template>
	<view class="InvoiceEntry">
		<u-navbar
			title="发票录入" 
			left-text="" 
			right-text="录入规则" 
			@leftClick="onClickBack" 
			@rightClick="onClickRight"
			:placeholder="true"
			:fixed="true"
			:safeAreaInsetTop="true"
		></u-navbar>
		<view class="w-ml-15 w-m-10">以下是必填项目</view>
		<view class="content">
			<u--form
				labelPosition="left"
				:model="formData"
				ref="form1" >
				<u-form-item
					label="发票面值"
					prop="faceValue"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.faceValue" border="none" placeholder="请输入"></u--input>
				</u-form-item>
				<u-form-item
					label="发票代码"
					prop="InvoiceCode"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.InvoiceCode" border="none" placeholder="请输入"></u--input>
				</u-form-item>
				<u-form-item
					label="发票号"
					prop="InvoiceNo"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.InvoiceNo" border="none" placeholder="请输入"></u--input>
				</u-form-item>
				<u-form-item
					label="税率"
					prop="rate"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.rate" border="none" placeholder="请输入"></u--input>
				</u-form-item>
				<u-form-item
					label="税额"
					prop="TaxAmount"
					borderBottom
					labelWidth="100"
					ref="item1">
					<!-- <u--input v-model="formData.TaxAmount" border="none" placeholder="请输入"></u--input> -->
				</u-form-item>
				<u-form-item
					label="开票时间"
					prop="timer"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.timer" border="none"
						:readonly="true"
						@focus="showTime = true"
						placeholder="请输入"></u--input>
					<u-datetime-picker
						:show="showTime"
						:value="choiceTime"
						mode="date"
						@cancel="cancelTime"
						@confirm="confirmTime"
						:maxDate="maxDate"
						:formatter="formatter"
					></u-datetime-picker>
				</u-form-item>
				<!-- <u-form-item
					label="发票内容"
					prop="invoiceContent"
					borderBottom
					ref="item1">
					<u--textarea v-model="formData.invoiceContent" placeholder="请输入内容"></u--textarea>
				</u-form-item> -->
				<view style="margin: 20rpx 0;">
					发票内容
				</view>
				<u--textarea v-model="formData.invoiceContent" placeholder="请输入发票内容"></u--textarea>
				<u-form-item
					label="快递单号"
					prop="orderNo"
					borderBottom
					labelWidth="100"
					ref="item1">
					<u--input v-model="formData.orderNo" border="none" placeholder="请输入"></u--input>
				</u-form-item>
				<view style="margin: 20rpx 0;">
					上传发票照片
				</view>
				<u-upload
					:fileList="uploadImg"
					@afterRead="afterRead"
					@delete="deletePic"
					name="6"
					multiple
					:maxCount="1"
					width="250"
					height="150">
					<!-- <image src="https://cdn.uviewui.com/uview/demo/upload/positive.png" 
					mode="widthFix" style="width: 250px;height: 150px;"></image> -->
				</u-upload>
				<view style="color: #999;">上传发票图片大小不超过2M</view>
				<view style="margin: 20rpx 0;">
					备注
				</view>
				<u--textarea v-model="formData.remarks" placeholder="请输入备注"></u--textarea>
			</u--form>
			<view class="w-mt-15">
				<u-button @click="submit" type="primary">提交</u-button>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
export default {
	data() {
		return {
			formData: {
				faceValue: '',
				InvoiceCode: '',
				InvoiceNo: '',
				rate: '',
				TaxAmount: '',
				timer: '',
				invoiceContent: '',
				orderNo: '',
				remarks: ''
			},
			showTime: false,
			choiceTime: Number(new Date()),
			maxDate: Number(new Date()),
			uploadImg: []
		}
	},
	methods: {
		// 返回页面
		onClickBack () {
			uni.navigateBack()
		},
		// 录入规则
		onClickRight(){
			uni.navigateTo({
				url: '/pages/payfor/EntryRules'
			})
		},
		submit () {
			if (this.formData.faceValue === '') {
				this.$refs.uToast.show({
					type: 'default',
					title: '默认主题',
					message: "请输入发票面值",
				})
				return
			}
			if (this.formData.InvoiceCode === '') {
				this.$refs.uToast.show({
					type: 'default',
					title: '默认主题',
					message: "请输入发票代码",
				})
				return
			}
			if (this.formData.InvoiceNo === '') {
				this.$refs.uToast.show({
					type: 'default',
					title: '默认主题',
					message: "请输入发票号",
				})
				return
			}
			if (this.formData.rate === '') {
				this.$refs.uToast.show({
					type: 'default',
					title: '默认主题',
					message: "请输入税率",
				})
				return
			}
			let params = {
				MerchantGrade: this.MerchantGrade,
				MerchantStatus: this.MerchantStatus,
				showCurrStartTime: this.showCurrStartTime,
				showCurrEndTime: this.showCurrEndTime,
				number: this.formData.number,
				name: this.formData.name,
				agent: this.formData.agent,
				account: this.formData.account,
			}
			console.log(params)
		},
		cancelTime () {
			this.showTime = false
		},
		confirmTime (e) {
			this.cancelTime()
			this.formData.timer = this.format(e.value)
		},
		formatter(type, value) {
			if (type === 'year') {
					return `${value}年`
			}
			if (type === 'month') {
					return `${value}月`
			}
			if (type === 'day') {
					return `${value}日`
			}
			return value
		},
		format(time) {
			var time = new Date(time);
			var y = time.getFullYear();
			var m = time.getMonth()+1;
			var d = time.getDate();
			var h = time.getHours();
			var mm = time.getMinutes();
			var s = time.getSeconds();
			return y+'-'+this.add0(m)+'-'+this.add0(d);
		},
		add0(m){return m<10?'0'+m:m },
		async afterRead(event) {
			console.log(event)
		},
		deletePic(event) {
			this[`fileList${event.name}`].splice(event.index, 1)
		},
	}
}
</script>

<style lang="scss" scoped>
.InvoiceEntry {
	.content {
		padding: 10rpx 20rpx;
		background: #FFFFFF;
	}
}
</style>
